<template>
    <div class="Manage">
        <Header :zIndex="3" ref="Header"></Header>
        <div class="content-wrap">
        <center>
            <div class="top">
            <ul class="daohang_list">
                <li><router-link class="list_item" :to="{ path: '/Create' }">创建活动</router-link></li>
                <li><router-link class="list_item" :to="{ path: '/Manage' }">投票管理</router-link></li>
                <li><router-link class="list_item" :to="{ path: '/Level' }">账户升级</router-link></li>
                <li><router-link class="list_item on" :to="{ path: '/Userinfo' }">个人中心</router-link></li>
                <li><router-link class="list_item" :to="{ path: '/Invate' }">推荐有奖</router-link></li>
            </ul>
            </div>
            <div class="info_box">
                <div class="left">
                    <div class="grzl">个人中心</div>
                    <ul class="nav_child">
                    <li><router-link :to="{ path: '/Userinfo' }">个人信息</router-link></li>
                    <li><router-link class="on" :to="{path: '/Account'}">收款信息</router-link></li>
                    <li><router-link :to="{path: '/Address'}">收件地址</router-link></li>
                    <li><router-link :to="{path: '/Invoice'}">发票信息</router-link></li>
                    <li><router-link :to="{path: '/InvoiceRecord'}">发票管理</router-link></li>
                    <li><router-link :to="{path: '/DrawList'}">提现记录</router-link></li>
                    <li><router-link :to="{ path: '/Logs' }">消费记录</router-link></li>
                    <li><router-link :to="{ path: '/Editpass' }">修改密码</router-link></li>
                    </ul>
                </div>
                <div class="iinforignt" style="padding-top: 40px">
                    <div style="width: 50%; margin: 0 auto">
                        <el-form ref="form" label-width="120px">
                            <el-form-item label="收款人姓名">
                                <el-input v-model="account.bankUser" placeholder="收款人真实姓名" auto-complete="false" maxlength="100"></el-input>
                            </el-form-item>
                            <el-form-item label="开户银行">
                                <el-input v-model="account.bankName" auto-complete="false" placeholder="开户银行名称或支付宝" maxlength="100"></el-input>
                            </el-form-item>
                            <el-form-item label="银行账号">
                                <el-input v-model="account.bankNo" auto-complete="false" placeholder="银行账号或支付宝账号"  maxlength="50"></el-input>
                            </el-form-item>
                            <el-form-item>
                                <el-button type="primary" @click="update">保存</el-button>
                            </el-form-item>
                        </el-form>
                    </div>
                </div>
                <div class="clear"></div>
            </div>
        </center>
        </div>
        <Footer></Footer>
    </div>
</template>
<script>
import User from '../../utils/user'
import Ajax from '../../utils/ajax'
import Footer from '../components/Footer.vue'
import Header from '../components/Header.vue'

export default {
    name:'Account',
    components: {
        Header,
        Footer
    },
    data(){
        return {
            account:{}
        }
    },
    created(){
        if(!User.getToken() || !User.getInfo()) {
            this.$router.replace('/Login');
            return;
        }
        this.setTitle('收款信息');
        this.loadInfo();
    },
    methods: {
        loadInfo(){
            Ajax.get('member/account').then(res=>{
                if(res.code == 0){
                    this.account = res.data;
                } else {
                    this.$alert(res.msg);
                }
            }).catch(err=>{
                console.error(err);
                this.$alert('获取数据失败');
            })
        },
        update(){
            if(!this.account.bankUser) {
                this.$alert('收款人姓名不能为空');
                return;
            }
            if(!this.account.bankName){
                this.$alert('开户银行不能为空')
                return;
            }
            if(!this.account.bankNo){
                this.$alert('银行账号不能为空')
                return;
            }
            Ajax.post('member/update/account', this.account).then(res=>{
                if(res.code == 0){
                    this.$alert('更新成功');
                } else {
                    this.$alert(res.msg);
                }
            }).catch(err=>{
                console.error(err);
                this.$alert('更新失败');
            })
        }
    }
}
</script>

<style src="@/assets/css/manage.css"  scoped></style>
<style src="@/assets/css/userinfo.css"  scoped></style>
